<%@ include file="/common/taglibs.jsp"%>

<head>
    <title><fmt:message key="eventDetail.title"/></title>
    <meta name="heading" content="<fmt:message key='eventDetail.heading'/>"/>
    <sx:head />
</head>

<c:set var="delObject" scope="request"><fmt:message key="eventList.event"/></c:set>
<script type="text/javascript">var msgDelConfirm =
   "<fmt:message key="delete.confirm"><fmt:param value="${delObject}"/></fmt:message>";
</script>

<div class="span2">
    <h2><fmt:message key="eventDetail.heading"/></h2>
    <fmt:message key="eventDetail.message"/>
</div>

<div class="span7">
    <s:form id="eventForm" action="saveEvent" method="post" validate="true" cssClass="well form-horizontal">
    	<s:hidden key="event.id"/>
        <fieldset class="control-group">
    	<label class="control-label"> PostDate: </label>
    	<div class="controls">
    	<sx:datetimepicker  required="true" name="event.postDate" value="event.postDate"/>
    	<sx:datetimepicker  required="true" name="hourformat" value="hourformat" type="time"/>
    	</div>
		</fieldset>
		<s:select required = "true" name="event.systemuser.id" list="systemuserList" listKey="id" listValue="name"   label="Systemusers"></s:select>		
    	<c:if test="${not empty event.id}">
    	<fieldset class="control-group">
    	<label class="control-label">  </label>
    	<div class="controls">
    			<a href="editSystemuser?id=<c:out value="${event.systemuser.id}"/>">View <c:out value="${event.systemuser.name}"/></a>
    	</div>
		</fieldset>
		 </c:if>
        <s:textfield key="event.title" required="true" maxlength="100" />
        <s:textfield key="event.viewTimes" required="true" maxlength="255" />
        <s:textarea key="event.content" required="true" maxlength="255" id="Content"/>       
        <fieldset class="control-group">
    	<label class="control-label"> Start Date: </label>
    	<div class="controls">
    	<sx:datetimepicker  required="true" name="event.startDate" value="event.startDate"/>
    	</div>
		</fieldset>
        <fieldset class="control-group">
    	<label class="control-label"> End Date: </label>
    	<div class="controls">
    	<sx:datetimepicker  required="true" name="event.endDate" value="event.endDate"/>
    	</div>
		</fieldset>
        <s:textfield key="event.location" required="true" maxlength="50" />
		<s:select name="event.type" list="eventTypeList" label="Type" required="true"/>
        <div id="actions" class="form-actions">
            <s:submit type="button" cssClass="btn btn-primary" method="save" key="button.save" theme="simple">
                <i class="icon-ok icon-white"></i> <fmt:message key="button.save"/>
            </s:submit>
            <c:if test="${not empty event.id}">
                <s:submit type="button" cssClass="btn btn-warning" method="delete" key="button.delete"
                    onclick="return confirmMessage(msgDelConfirm)" theme="simple">
                    <i class="icon-trash icon-white"></i> <fmt:message key="button.delete"/>
                </s:submit>
            </c:if>
            <s:submit type="button" cssClass="btn" method="cancel" key="button.cancel" theme="simple">
                <i class="icon-remove"></i> <fmt:message key="button.cancel"/>
            </s:submit>
        </div>
    </s:form>
   <% 
		CKEditorConfig settings = new CKEditorConfig();
		settings.addConfigValue("width","500");
		settings.addConfigValue("height","500");
		%>
   <ckeditor:replace  basePath="/ckeditor/" replace ="Content" config="<%=settings %>"/> 
</div>

<link rel="stylesheet" type="text/css" media="all" href="<c:url value='/scripts/datepicker/css/datepicker.css'/>" />
<script type="text/javascript" src="<c:url value='/scripts/datepicker/js/bootstrap-datepicker.js'/>"></script>
<c:if test="${pageContext.request.locale.language != 'en'}">
<script type="text/javascript" src="<c:url value='/scripts/datepicker/js/locales/bootstrap-datepicker.${pageContext.request.locale.language}.js'/>"></script>
</c:if>
<script type="text/javascript">
    $(document).ready(function() {
        $("input[type='text']:visible:enabled:first", document.forms['eventForm']).focus();
        $('.input-append.date').datepicker({format: "<fmt:message key='calendar.format'/>", weekStart: "<fmt:message key='calendar.weekstart'/>", language: '${pageContext.request.locale.language}'});
    });
</script>
